liwe.fx.slide = {};

liwe.fx.slide.start = function ( el, dest_w, dest_h, cback, step, millis )
{
	if ( el.fx_slide_interval ) return;

	if ( ! millis ) millis = 10;

	liwe.fx.slide._prepare ( el, dest_w, dest_h, cback, step );

	el.fx_slide_interval = setInterval ( function () { liwe.fx.slide._slide ( el ); }, millis );
};

liwe.fx.slide._prepare = function ( el, dest_w, dest_h, cback, step )
{
	if ( ! step ) step = 100;

	var w = el.clientWidth;
	var h = el.clientHeight;

	el.fx_slide_x = ( dest_w - w ) / step;
	el.fx_slide_y = ( dest_h - h ) / step;

	if ( el.fx_slide_x > 0 ) 
		el.fx_slide_x = Math.ceil ( el.fx_slide_x );
	else
		el.fx_slide_x = Math.floor ( el.fx_slide_x );

	if ( el.fx_slide_y > 0 ) 
		el.fx_slide_y = Math.ceil ( el.fx_slide_y );
	else
		el.fx_slide_y = Math.floor ( el.fx_slide_y );

	el.fx_slide_dest_w = dest_w;
	el.fx_slide_dest_h = dest_h;
	el.fx_slide_cback = cback;
};

liwe.fx.slide._slide = function ( el )
{
	if ( liwe.fx.slide._step ( el ) )
	{
		clearInterval ( el.fx_slide_interval );
		el.fx_slide_interval = 0;
		if ( el.fx_slide_cback ) el.fx_slide_cback ();
	}
};

liwe.fx.slide._step = function ( el )
{
	var w = el.clientWidth;
	var h = el.clientHeight;
	var x_stop = false, y_stop = false;
	var new_val;

	if ( el.fx_slide_x == 0 || el.fx_slide_dest_w == w )
	{
		x_stop = true;
	} else {
		if ( el.fx_slide_x > 0 ) {
			if ( w >= el.fx_slide_dest_w )
			{
				x_stop = true;
			} else {
				new_val = w + el.fx_slide_x;
				if ( new_val > el.fx_slide_dest_w ) new_val = el.fx_slide_dest_w;
				el.style.width = new_val + "px";
			}
		} else {
			if ( w <= 0 )
			{
				x_stop = true;
			} else {
				new_val = w + el.fx_slide_x;
				if ( new_val < el.fx_slide_dest_w ) new_val = el.fx_slide_dest_w;
				el.style.xpos = new_val + "px";
			}
		}
	}

	if ( el.fx_slide_y == 0 || el.fx_slide_dest_h == h )
	{
		y_stop = true;
	} else {
		if ( el.fx_slide_y > 0 ) {
			if ( h >= el.fx_slide_dest_h )
			{
				y_stop = true;
			} else {
				new_val = h + el.fx_slide_y;
				if ( new_val > el.fx_slide_dest_h ) new_val = el.fx_slide_dest_h;
				el.style.ypos = new_val + "px";
			}
		} else {
			if ( h <= el.fx_slide_dest_h )
			{
				y_stop = true;
			} else {
				new_val = h + el.fx_slide_y;
				if ( new_val < el.fx_slide_dest_h ) new_val = el.fx_slide_dest_h;
				el.style.height = new_val + "px";
			}
		}
	}

	return ( x_stop == true && y_stop == true );
};

/* ==================
   WEBKIT & MOZILLA
===================*/

liwe.fx.slide_default_millis = 500;
liwe.fx.slide_default_timing = 'ease-in';

liwe.fx.slide_in = function ( el, pos, cback, millis, timing )
{
	liwe.fx.slide ( el, 'in', pos, cback, millis, timing );
};

liwe.fx.slide_out = function ( el, pos, cback, millis, timing )
{
	liwe.fx.slide ( el, 'out', pos, cback, millis, timing);
};

liwe.fx.slide = function ( el, dir, pos, cback, millis, timing )
{
	if ( ! el || el.dataset [ 'animating ' ] || el.dataset [ 'last_slide' ] == dir ) return;

	if ( ! millis ) millis = liwe.fx.slide_default_millis;
	if ( ! timing ) timing = liwe.fx.slide_default_timing;

	if ( ! el.dataset [ 'slide' ] )
	{
		el.dataset  [ 'slide' ] = true;
		el.style.position = 'absolute';
		el.style [ pos ] = '0';
	}
	el.dataset [ 'animating' ] = true;
	el.dataset [ 'last_slide' ] = dir;

	var evthandler = function ( event ) 
	{
		this.removeEventListener ( 'webkitTransitionEnd', evthandler );
		this.removeEventListener ( 'transitionend', evthandler );

		this.dataset [ 'animating' ] = undefined;
		if ( cback ) cback ();
	};

	el.style.WebkitTransition = '-webkit-transform ' + millis + 'ms ' + timing;
	el.style.MozTransition = '-moz-transform ' + millis + 'ms ' + timing;
	
	el.addEventListener ( 'webkitTransitionEnd', evthandler );
	el.addEventListener ( 'transitionend', evthandler );

	var xy = ( pos == 'left' || pos == 'right' ) ? 'X' : 'Y';
	var delta = 0; 
	if ( dir == 'out')
	{
		switch ( pos )
		{
			case 'left':
			case 'top':
				delta = '-100%';
				break;
			case 'right':
			case 'bottom':
				delta = '100%';
				break;
		}
	}

	el.style.WebkitTransform = 'translate' + xy + '(' + delta + ')';
	el.style.MozTransform = 'translate' + xy + '(' + delta + ')';
};
